<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>首页</title>
	</head>
	<body background="img/laptop-820274_1280.jpg">
		<style>
            body{
				background-size: 100%;
				background-repeat: no-repeat;
				background-attachment: fixed;
			}			
			*{
				margin: 0;
				padding: 0;
			}

			.tou{
				height:60px;
				background-color: lightblue;
			}
            nav {
            	width: 800px;
    height: 60px;
    background-color: lightblue;
}

nav p {
    font-family: arial;
    font-size: 24px;
    text-transform: uppercase;
    line-height: 55px;
    padding: 0 20px;
    float: left;
}

nav ul {
    float: left;
}

nav ul li {
    float: left;
    list-style: none;
    position: relative;
}
nav ul li a:hover{
	color: red;
	border-bottom: solid deepskyblue 5px;
}
nav ul li a:checked{
	color: black;
}

nav ul li a {
    display: block;
    font-family: arial;
    font-size: 18px;
    padding: 15px 15px;
    text-decoration: none;
    color: black;
}

nav ul li ul {
    display: none;
    position: absolute;
    background-color: lightcyan;
    padding: 10px;
    border-radius: 0px 0px 4px 4px;
}

nav ul li:hover ul {
    display: block;
}

nav ul li ul li {
    width: 160px;
    border-radius: 4px;
}

nav ul li ul li a {
    padding: 8px 10px;
}

nav ul li ul li a:hover {
    background-color: lightcyan;
    border-bottom:solid 2px skyblue;
}
		    
			h1{
				text-align: center;
				font-size: 50px;
			}
			.a{
				margin: 0 auto;
				height: 950px;
				width:800px;
				background-color: beige;
				box-shadow: 10px 10px 20px 5px black;
			}
			.a1{
				margin: 0 auto ;
				height: 700px;
				width:500px;
				line-height: 60px;
			}
			p{
				font-size: 20px;
			}
			nav p{
				font-size:30px;
			}
			font{
				border-bottom:solid 2px;
				font-weight:400;
			}	
			.A1{
				text-align: center;
			}	
			.A1 h1{
				font-size: 50px;
				color: yellow;
				text-shadow: 1px 2px red;
			}	
			.da{
				overflow: auto;
			}
			.A2{
				float:left;
			}
			.A3{
				float:right;
			}
			h2{
				font-size: 60px;
				text-align: center;
				color: dodgerblue;
				text-shadow: 1px 2px black;
			}
			a{
				text-decoration: none;
				font-size: 40px;
				color: yellow;
			}
			.lianjie a:hover{
				display: inline-block;
				color:red;
				
			}
			.lianjie{
				margin: 200px auto;
				width: 300px;
				text-align: center;
				background-color:rgba(0,0,280,0.1); 
			}
		</style>
		
		<div class="tou">
        <nav>
        <p>WEBSITES</p>
        <ul>
            <li><a href="http://leslie123456.gitee.io/big-assignment">首页</a></li>
            <li><a href="http://leslie123456.gitee.io/website">公司网站</a></li>
            <li><a href="http://leslie123456.gitee.io/product-website">商品网站</a></li>
            <li><a>相关</a>
                <ul>
                    <li><a href="http://leslie123456.gitee.io/business-plan">创业计划书</a></li>
                    <li><a href="http://leslie123456.gitee.io/cooperative-partner">合作伙伴</a></li>
                </ul>
            </li>            
        </ul>     
            </li>            
        </ul>
        </nav>				
		</div>		
		
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<div class="A1">
			<h1>你也想成为职业选手吗？</h1>
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />
		<br />



	
		</div>
		
		<div class="da">
		<div class="A2">
			<img src="img/22-08-30-030.jpg" style="height: 500px;"/>
		</div>
		<div class="A3">
			<img src="img/22-10-25-025.jpg" style="height: 500px;" />
		</div>			
		</div>



        <h2>来吧加入我们，选择适合你的专属电竞设备！！！</h2>
        
        
        
        <div class="lianjie">
        	<a href="http://leslie123456.gitee.io/product-website">电竞外设商店</a>       	
        </div>

	</body>
</html>
